<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="../common/common.jsp" %>
<script type="text/javascript" src="<%=request.getContextPath() %>/js/shoppingCart.js"></script>
<title>购物车</title>
</head>

<script type="text/javascript">

$(document).ready(function() {
	showCartList();
});

function showCartList() {
	$.ajax({
		url:'ajaxInitShoppingCartList.action',
		data: null,
		type:'post',
		async: false,
		dataType: 'json',
		success: ajaxInitShoppingCartList_Callback
	});
}

function ajaxInitShoppingCartList_Callback(res) {
	var rs = res.result;
	var data = res.data;
	var dataHtml = '';
	if(rs != 0) {
		alert("加载购物车数据失败！");
	}else {
		if(data.length == "") {
			dataHtml += '<div style="width: 600px;margin-left: 100px;margin-top: 50px;color: orange;font-weight: bold;"><span>当前购物车中暂时无商品！</span><div>';
		}else {
			dataHtml += 
				'<table width="100%" id="itemListTable" border="1px">'+
				'<thead>'+
					'<tr>'+
						'<td width="60">商品图片</td>'+
						'<td width="300">商品名称</td>'+
						'<td width="150">商品价格</td>'+
						'<td width="150">购买数量</td>'+
						'<td width="150">小计</td>'+
						'<td width="150">操作</td>'+
					'</tr>'+
				'</thead>';
			for(var i=0;i<data.length;i++) {
				dataHtml += 
					'<tr>'+
						'<td><div style="width: 60px;height: 60px;"><a target="_blank" href="<%=request.getContextPath() %>/goodsItem.action?goodsId='+data[i].goodsId+'"><img width="56px" height="56px"  style="margin: 2px;" alt="" src="<%=request.getContextPath() %>/'+data[i].goodsPictureS+'" /></a></div></td>'+
						'<td><a target="_blank" href="<%=request.getContextPath() %>/goodsItem.action?goodsId='+data[i].goodsId+'">'+data[i].goodsName+'</a></td>'+
						'<td id="goodsPrice_'+data[i].goodsId+'">'+data[i].goodsPrice+'</td>'+
						'<td><input onclick="changeCartGoodsCnt('+data[i].goodsId+',\'-\')" type="button" style="width: 22px;height: 22px;" value="-"/><input readOnly="true" id="goodsCnt_'+data[i].goodsId+'" type="text" style="width: 30px;" value="'+data[i].goodsCnt+'"/><input onclick="changeCartGoodsCnt('+data[i].goodsId+',\'+\')" type="button" style="width: 22px;height: 22px;" value="+"/></td>'+
						'<td>￥'+data[i].goodsPrice*data[i].goodsCnt+'</td>'+
						'<td><a href="javascript: void(0)" onclick="deleteGoodsInCart('+data[i].goodsId+')">删除</a></td>'+
					'</tr>';
			}
			dataHtml += '<tr>'+
							'<td align="right" colspan="6"><font color="#FF6600" style="font-weight: bold;" id="totalPrice"></font></td>'+
						'</tr>';
			dataHtml += '</table>';
			dataHtml += '<div style="width: 100%;height: auto;overflow: hidden;margin-top: 10px;">'+
							'<div style="width: 200px;height: 30px;line-height: 30px;float: left;"><input type="button" style="width: 100%;height: 30px;line-height: 30px;font-weight: bold;" onclick="goToIndex()" value="继续购物"/></div>'+
							'<div style="width: 200px;height: 30px;line-height: 30px;float: right;"><input type="button" style="width: 100%;height: 30px;line-height: 30px;font-weight: bold;" onclick="goToInitOrder()" value="去结算"/></div>'+
						'</div>';
		}
		$('#itemListDiv').html(dataHtml);
		updateTotalPrice(res);
	}
}

</script>

<body>
	<%@include file="frame/top.jsp" %>
	<div class="main_div">
	<%@include file="frame/navigation.jsp" %>
	<div id="itemListDiv" style="width: 990px;min-height: 400px;margin: 0 auto;border: 1px solid #CCC;">

	</div>
	</div>
	<%@include file="frame/feet2.jsp" %>
</body>
</html>
